<template>
  <div @touchmove.stop @touchmove.prevent @click="hideEgg()" class="bg-blur icon animated fadeIn">
    <div class="pop box box-ver">
      <div class="pop-header box box-ac box-jc">
        <div @click.stop="showEgg()" class="icon icon-left icon-blue">
          <div v-if="showEggFlag" class="icon icon-egg animated bounce"></div>
        </div>
        <div class="box-f1 box box-ac box-jc">
          <div class="icon icon-rule-title"></div>
        </div>
        <div class="icon icon-right"></div>
      </div>
      <div @touchmove.stop class="pop-content box-f1 of-y-s">
        <!-- <p>注册长沙IFS会员，美食享不停！</p>
        <p>集印点亮“长沙IFS美食小镇”，更有惊喜礼品等你哦！</p> -->
        <p>活动时间：</p>
        <p class="txt-red">2018年5月7日-6月3日</p>
        <p>活动内容：</p>
        <p>餐饮商户消费，单笔满50元可获集印1枚，<span class="txt-red">建造“长沙 IFS美食之城”</span>。集满8枚可获赠<span class="txt-red">哈根达斯单球冰淇淋券</span>1张。</p>
        <p>参与方式：</p>
        <p>关注“长沙IFS”官方微信服务号，点击“THE TOP”菜单，进入“寻味之旅”活动H5，参与线上集印。</p>
        <p>活动说明：</p>
        <p>1、礼品<span class="txt-red">数量有限</span>，赠完即止。</p>
        <p>2、单笔消费满50元可获赠集印1枚。<span class="txt-red">单张小票仅可集印一次</span>，重复上传无效。</p>
        <p>3、成功上传消费小票后，工作人员于<span class="txt-red">3个工作日内审核完毕</span>。审核通过可获赠集印1枚。</p>
        <p>4、您可随时进入活动H5页面<span class="txt-red">查看集印进度</span>。</p>
        <p>5、参与“寻味之旅”消费小票<span class="txt-red">不可重复</span>参与会员积分或其他商场推广活动。</p>
        <p>6、成功获赠哈根达斯单球冰淇淋券可于THE TOP<span class="txt-red">会员个人中心---我的券包内查看</span>。</p>
        <p>7、参与“寻味之旅”并累计消费金额<span class="txt-red">前5名THE TOP会员，可获赠</span>湘爵士1000元储值卡。</p>
        <p>8、如有疑问，请咨询长沙IFS客服人员。</p>
      </div>
      <div @click="hideRule()" class="icon icon-button icon-button-know"></div>
    </div>
  </div>
</template>

<script>

export default {
  name: 'rule',
  data () {
    return {
      showEggFlag: false
    }
  },
  mounted () {
  },
  methods: {
    hideRule () {
      this.$emit('hideRule')
    },
    showEgg () {
      this.showEggFlag = true
    },
    hideEgg () {
      this.showEggFlag = false
    }
  }
}
</script>

<style lang="scss" scoped>
@import '../assets/css/mixins.scss';
.pop{
  width:5.84rem;
  height:8.4rem;
  background-color:#FFF;
  border-radius:.33rem;
}
.pop-content{
  p{
    color:#727171;
    padding-bottom:.1rem;
  }
  .txt-red{
    color:#4e2c69;
  }
}
.icon-rule-title{
  height:.47rem;
  width:1.96rem;
  @include bg-image('../assets/images/icon-rule-title')
}

.icon-egg{
  width:2.14rem;
  height:1.5rem;
  position: absolute;
  bottom:.94rem;
  left:-.65rem;
  @include bg-image('../assets/images/icon-egg');
}

</style>
